import React, { Component } from 'react'
import { Tabs } from 'antd';

import {connect} from "react-redux"
import * as action from "../../api/index"
import {bindActionCreators} from "redux"
import TabsComponengts from "../../components/TabComponents"
const { TabPane } = Tabs;

export class Classify extends Component {
    callback(key) {
        this.props.checkTab(key)
    }
    render() {
        let  {list,listChildren} = this.props
        return (
            <div>
               <Tabs tabPosition={"left"} defaultActiveKey="0" onChange={this.callback.bind(this)}>
                   {
                       list&&list.map((item,index)=>{
                           return  <TabPane tab={item.title} key={index}>
                               {
                                   listChildren&&listChildren.map((item,i)=>{
                                       return   <TabsComponengts key={i} item={item}/>
                                   })
                               }
                           </TabPane>
                       })
                   }
                </Tabs>
            </div>
        )
    }
}

const mapState = (state) =>{
    return {
        ...state.reduce
    }
} 
export default connect(mapState,(dispatch)=>bindActionCreators(action,dispatch))(Classify)
